<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Title</title>
</head>
<body>

</body>
<script>
	// - 方式一: Object构造函数模式
	// - 套路: 先创建空Object对象, 再动态添加属性/方法
	// - 适用场景: 起始时不确定对象内部数据
	// - 问题: 语句太多
	{
		// const obj = new Object();
		// obj.userName = "zhangsan";
		// obj.fn = function(){
		//
		// };
	}
	
	
	
	
	// * 方式二: 对象字面量模式
	// * 套路: 使用{}创建对象, 同时指定属性/方法
	// * 适用场景: 起始时对象内部数据是确定的
	// * 问题: 如果创建多个同结构的对象, 有重复代码
	// {
	// 	const obj = {
	// 		userName:"zhangsan",
	// 		fn:function(){
	//
	// 		}
	// 	}
	//
	// 	const obj2 = {
	// 		userName:"lisi",
	// 		fn:function(){
	//
	// 		}
	// 	}
	// }
	// * 方式三: 工厂模式
	// - 套路: 通过工厂函数动态创建对象并返回
	// - 适用场景: 需要创建多个对象
	// - 问题: 对象没有一个具体的类型, 都是Object类型
	
	{
		// function creator(userName,age){
		// 	return {
		// 		userName,
		// 		age,
		// 		fn(){
		// 			console.log(this.userName,tis.age)
		// 		}
		// 	}
		// }
		// const obj = creator();
		// const obj2 = creator();
		// console.log(obj === obj2);
		// console.log(obj.constructor)
		// console.log(obj2.constructor)
	}
	
	
	// * 方式四: 自定义构造函数模式
	// * 套路: 自定义构造函数, 通过new创建对象
	// * 适用场景: 需要创建多个类型确定的对象
	// * 问题: 每个对象都有相同的数据, 浪费内存
	{
		// function Box(){
		// 	this.userName = "lisi";
		// 	this.age = 12;
		// }
		// function Desk(){
		//
		// }
		// const obj = new Box();
		// const obj2 = new Desk();
		// console.log(obj.constructor)
		// console.log(obj2.constructor);
		// const obj3 = new Box();
		// console.log(obj === obj3);
		// obj.userName = "ZHANGSAN";
		// console.log(obj3.userName);// lisi
	}
	
	
	
	
	// * 方式五: 构造函数+原型的组合模式
	// * 套路: 自定义构造函数, 属性在函数中初始化, 方法添加到原型上
	// * 适用场景: 需要创建多个类型确定的对象
	{
		// function Box(userName){
		// 	this.userName = userName
		// }
		// Box.prototype.run = function(){
		// 	console.log(this.userName);
		// }
		// const obj = new Box("obj");
		// const obj2 = new Box("obj2");
		// console.log(obj !== obj2);// false
		// console.log(obj.__proto__ === Box.prototype);// true
		// console.log(obj2.__proto__ === Box.prototype);// true
		// console.log(obj.__proto__ === obj2.__proto__);// true
		// obj.run();
		// obj2.run();
	}
</script>
</html>